<template>

  <div class="animate__animated animate__fadeIn">
    <a-row :gutter="24">
      <a-card :bordered="false" class="widget-1" style="height: 750px;">
      <a-col :span="24" :lg="12" class="mb-24" style="padding-left: 60px;">
          <h4 style="margin-bottom: 20px; margin-top: 20px;">立即申请成为审核人员</h4>
          <el-form :label-position="labelPosition" label-width="100px" :model="reviewApply" style="width: 300px">

            <el-form-item label="姓名：">
              <el-input v-model="reviewApply.name"></el-input>
            </el-form-item>
            <el-form-item label="年龄:">
              <el-input v-model="reviewApply.age"></el-input>
            </el-form-item>
            <el-form-item label="联系方式:">
              <el-input v-model="reviewApply.contact"></el-input>
            </el-form-item>
            <el-form-item label="学历:">
              <el-select v-model="reviewApply.edu" placeholder="请选择您的学历">
                <el-option label="初中及以下" value="初中及以下"></el-option>
                <el-option label="高中" value="高中"></el-option>
                <el-option label="大学本科" value="大学本科"></el-option>
                <el-option label="大学本科以上" value="大学本科以上"></el-option>
              </el-select>
            </el-form-item>
            <el-form-item label="申请理由（150字内）：">
              <el-input type="textarea" v-model="reviewApply.reason"></el-input>
            </el-form-item>
            <el-form-item>
              <el-button type="primary" @click="onSubmit">提交信息</el-button>
            </el-form-item>
          </el-form>


      </a-col>
      <a-col :span="24" :lg="12" class="mb-24" style=" display: flex; align-items: center; height:650px;">
        <img src="images/review03.svg" style="width: 650px; display: block; "/>
      </a-col>
      </a-card>
    </a-row>


  </div>
</template>

<script>



export default {
  components:{

  },
  data(){
    return{
      labelPosition: 'top',
      reviewApply: {
        name: '',
        reason: '',
        userId:'',
        type: '',
        contact:'',
        edu:'',
        status:''
      }
    }
  },
  name: "ReviewApply",
  methods:{
    toSignIn(){
      this.$router.push({
        path: "/sign-in"
      });
    },

    backHistory(){
      this.$router.go(-1);
    },
    checkout(){
      //TODO:检测是否已经申请审核员信息 如果没有进行申请 如果有 弹窗提示用户审核状态
      //判断是否有token 逻辑不完美 但是能用
      var token = sessionStorage.getItem("systemToken")
      console.log(token)
      if (token !== null && token !== '' && token!== undefined){
        //有toekn进行查询
        this.$axios({
          headers: {
            "Content-Type": "application/json;charset=UTF-8",
            "Authorization": sessionStorage.getItem("systemToken")
          },
          url: "/api/review/getReviewApplyByUserId", //后端请求的路径
          method: "get",
          params: {
            userId: sessionStorage.getItem("userId"),
          },
        }).then((response) => {
          console.log(response.data)
          if (response.data.status === 0) {
            //TODO:读取信息判断 审核状态
            if (response.data.data.status === '待审核') {
              swal("您的申请正在审核中", "稍后我们会将结果通知于您!!", "success")
                  .then((e) => {
                    this.backHistory();

                  })
            }else if (response.data.data.status === '已拒绝'){
              swal("很抱歉!", "您暂时没有通过我们平台的申请，请您保持活跃再次申请!", "warning")
                  .then((e) => {
                    this.backHistory();

                  })
            }else {
              swal("恭喜您!", "您已经成为审核人员!", "success")
                  .then((e) => {
                    this.backHistory();

                  })
            }

          }
          //TODO: 两种可能 status 10 0
        });
      }else {
        //无token 弹窗提示登录并跳转
        swal("请登录后再申请","","warning")
            .then((e) => {
              this.toSignIn();
            })
      }

    },
    onSubmit(){
      this.reviewApply.userId = sessionStorage.getItem("userId")
      this.reviewApply.status = "待审核"
      this.$axios({
        headers: {
          "Content-Type": "application/json;charset=UTF-8",
          "Authorization": sessionStorage.getItem("systemToken")
        },
        url: "/api/review/insertReviewApply", //后端请求的路径
        method: "post",
        data: this.reviewApply,
      }).then((response) => {
        console.log(response.data)
        if (response.data.status === 0) {
          swal("恭喜您!", "您的申请已经提交成功，稍后我们会将结果通知于您!", "success")
              .then((e) => {
                this.backHistory();

              })
        }

      });
    }
  },
  mounted() {
    // swal("恭喜您!", "您已经成为审核人员!", "success");
    this.checkout()
  }
}
</script>

<style lang="scss">

</style>